<template>
    <!-- 查询框 -->
    <a-card :bordered="false">
        <div class="table-page-search-wrapper">
            <a-form layout="inline" :form="form">
                <a-row :gutter="48">
                    <a-col :md="8" :sm="24">
                        <a-form-item label="集团卡号">
                            <a-input placeholder="请输入集团卡号" v-model="queryParam.groupCardNo" />
                        </a-form-item>
                    </a-col>
                    <a-col :md="10" :sm="24">
                        <a-range-picker @change="onChange" :show-time="{
                          hideDisabledOptions: true,
                          defaultValue: timeDefault,
                        }" format="YYYY-MM-DD HH:mm:ss" />
                    </a-col>
                    <a-col :md="6" :sm="24">
                        <span class="table-page-search-submitButtons">
                            <a-button type="primary" @click="getData">查询</a-button>
                            <a-button style="margin-left: 8px" @click="reset">重置</a-button>
                        </span>
                    </a-col>
                </a-row>
            </a-form>
        </div>

        <!-- 表格 绑定rowkey -->
        <div style="margin-top: 15px">
            <a-table :columns="columns" :dataSource="list" :bordered="true" :pagination="false"
                :rowKey="(record) => record.vouName" :loading="loading">
            </a-table>
        </div>
    </a-card>
</template>
  
  
<script>
import moment from 'moment'
import { getList } from '@/api/operateTools/index'

const columns = [
    {
        title: '券名称',
        dataIndex: 'vouName',
    },
    {
        title: '券数量',
        dataIndex: 'vouCount',
    },
    {
        title: '券号',
        dataIndex: 'voucherNo',
    },
    {
        title: '有效时间',
        dataIndex: 'maxDate',
    },
    {
        title: 'weid',
        dataIndex: 'weid',
    },
]

export default {
    data() {
        return {
            columns,
            list: [],
            form: this.$form.createForm(this),
            queryParam: {},
            loading: false,
            startDate: '',
            endTime: '',
            timeDefault: [moment('00:00:00', 'HH:mm:ss'), moment('11:59:59', 'HH:mm:ss')]
        }
    },
    methods: {
        moment,
        onChange(date, dateString) {
            const start = moment(date[0], 'YYYY-MM-DD').valueOf();
            const end = moment(date[1], 'YYYY-MM-DD').valueOf();
            this.startDate = moment(start).format('YYYY-MM-DD 00:00:00');
            this.endDate = moment(end).format('YYYY-MM-DD 23:59:59');
            console.log("时间选择", this.startDate, this.endDate)
        },
        // 查询数据
        async getData() {
            const { queryParam: { groupCardNo }, startDate, endDate } = this
            if (!groupCardNo) {
                this.$warning({
                    title: '请输入集团卡号',
                })
                return
            }
            if (!startDate) {
                this.$warning({
                    title: '请输入开始时间',
                })
                return
            }
            if (!endDate) {
                this.$warning({
                    title: '请输入结束时间',
                })
                return
            }
            this.loading = true
            const res = await getList({ cardNo: groupCardNo, startDate: startDate, endDate: endDate })
            this.loading = false
            if (res.code === 200 && res.success === true) {
                if (res.data.length == 0) {
                    this.$warning({
                        title: '没有券记录',
                    })
                } else {
                    this.list = res.data.validVouchers
                }
            } else {
                this.$error({
                    title: res.msg,
                })
            }

        },

        // 重置
        reset() {
            this.queryParam = {}
            this.integralData = []
        },
    },
    created() { },
}
</script>
  
<style scoped>

</style>